﻿@using Aspire.Dashboard.Components.Controls.Chart
@using Aspire.Dashboard.Model
@using Aspire.Dashboard.Model.Otlp
@using Aspire.Dashboard.Otlp.Model
@using Aspire.Dashboard.Resources
@using Aspire.Dashboard.Utils
@using Aspire.Dashboard.Extensions
@using System.Globalization
@using Aspire.Dashboard.Components.Controls.Grid
@using Dialogs = Aspire.Dashboard.Resources.Dialogs
@implements IDialogContentComponent<ExemplarsDialogViewModel>

@inject IStringLocalizer<Dialogs> Loc

<div style="max-height: 44vh; overflow-y: auto;">
    <FluentDataGrid Items="@MetricView"
                    RowSize="DataGridRowSize.Medium"
                    GridTemplateColumns="2fr 1fr 1fr 1fr"
                    TGridItem="ChartExemplar">
        <ChildContent>
            <TemplateColumn Title="@Loc[nameof(Dialogs.ExemplarsDialogTraceColumnHeader)]" TooltipText="@(context => GetTitle(context))" Tooltip="true">
                <span style="padding-left:5px; border-left-width: 5px; border-left-style: solid; border-left-color: @(context.Span != null ? ColorGenerator.Instance.GetColorHexByKey(OtlpResource.GetResourceName(context.Span.Source, Content.Resources)) : "transparent");">
                    @GetTitle(context)
                </span>
            </TemplateColumn>
            <TemplateColumn Title="@Loc[nameof(Dialogs.ExemplarsDialogTimestampColumnHeader)]" TooltipText="@(context => FormatHelpers.FormatDateTime(TimeProvider, TimeProvider.ToLocal(context.Start), MillisecondsDisplay.None, CultureInfo.CurrentCulture))" Tooltip="true">
                @FormatHelpers.FormatTimeWithOptionalDate(TimeProvider, TimeProvider.ToLocal(context.Start), MillisecondsDisplay.Truncated)
            </TemplateColumn>
            <TemplateColumn Title="@Loc[nameof(Dialogs.ExemplarsDialogValueColumnHeader)]">
                @FormatMetricValue(context.Value)
            </TemplateColumn>
            <TemplateColumn Title="@Loc[nameof(Dialogs.ExemplarsDialogDetailsColumnHeader)]">
                <FluentButton Appearance="Appearance.Lightweight" OnClick="@(() => OnViewDetailsAsync(context))">View</FluentButton>
            </TemplateColumn>
        </ChildContent>
        <EmptyContent>
            <FluentIcon Icon="Icons.Regular.Size24.ChartMultiple" />&nbsp;@Loc[nameof(ControlsStrings.MetricTableNoMetricsFound)]
        </EmptyContent>
    </FluentDataGrid>
</div>
